Visual Studio+Node.js开发环境安装配置 | 您所在的位置:网站首页 › visual studio 60安装 › Visual Studio+Node.js开发环境安装配置 |
Visual Studio+Node.js开发环境安装配置
基础安装一些可有可无的配置搭建一个简单的Web服务器安装nodemon启动Web服务器
基础安装
到微软官方下载Visual Studio社区版。安装后选择安装node.js开发环境。 到nodejs官网下载官方介质。不用选择太新的版本。 安装后在终端查看版本信息 > node -v v14.19.3 > npm -v 6.14.17查看配置信息 > npm list -global > npm config list 一些可有可无的配置如果不想全局模块和缓存文件都存放在C盘(默认在C:\Users\xiaoming\AppData\Roaming\npm),可以修改他们的位置。 > cd D: > mkdir node.js > cd node.js > mkdir node_global > mkdir node_cache > npm config set prefix "D:\node.js\node_global" > npm config set cache "D:\node.js\node_cache"再次执行npm命令,会报错: Error: EINVAL: invalid argument, mkdir D:\node.js\node_global"'修改配置文件C:\Users\xiaoming\.npmrc,添加如下内容: prefix=D:\node.js\node_global cache=D:\node.js\node_cache在环境变量 > 系统变量 > PATH中添加: D:\node.js\node_global再次执行npm命令,正常运行: > npm config list ; cli configs metrics-registry = "https://registry.npmjs.org/" scope = "" user-agent = "npm/6.14.17 node/v14.19.3 win32 x64" ; userconfig C:\Users\xiaoming\.npmrc cache = "D:\\node.js\\node_cache" prefix = "D:\\node.js\\node_global" ; builtin config undefined ; node bin location = C:\Program Files\nodejs\node.exe ; cwd = C:\Users\xiaoming ; HOME = C:\Users\xiaoming ; "npm config ls -l" to show all defaults.如果npm安装包比较慢,可以安装使用淘宝的cnpm镜像。淘宝的cnpm命令管理工具可以代替默认的npm管理工具。 > npm install -g cnpm --registry=https://registry.npm.taobao.org在系统变量 > xiaoming的用户变量中新建用户变量NODE_PATH,设置为 D:\node.js\node_global\node_modules在系统变量 > xiaoming的用户变量PATH中,将 C:\Users\xiaoming\AppData\Roaming\npm修改为 D:\node.js\node_global\node_modules即可在命令行中直接使用cnpm命令: > cnpm -v [email protected] (D:\node.js\node_global\node_modules\cnpm\lib\parse_argv.js) [email protected] (D:\node.js\node_global\node_modules\cnpm\node_modules\npm\index.js) [email protected] (C:\Program Files\nodejs\node.exe) [email protected] (D:\node.js\node_global\node_modules\cnpm\node_modules\npminstall\lib\index.js) prefix=D:\node.js\node_global win32 x64 10.0.19044 registry=https://registry.npmmirror.com 搭建一个简单的Web服务器新建项目文件夹如下 C:\Users\xiaoming\source\repos\node_demo\node_app在该目录下右键打开Visual Studio。在VS中,使用快捷键Ctrl+反引号,在VS中打开PowerShell终端。 切换到项目路径下 > cd C:\Users\xiaoming\source\repos\node_demo\node_app初始化项目 > npm init补充相应信息,回车结束命令后当前路径下会生成一个package.json文件。 创建入口文件(这里使用了PowerShell命令,也可以手动创建) > new-item server.js -type file安装express模块(可用来快速创建Web服务器) > npm install express编辑入口文件server.js const express = require("express"); const app = express(); // 设置app路由 app.get("/", (req, res) => { res.send("Hello World!"); }) const port = process.env.PORT || 5000; app.listen(port, () => { console.log(`Server running on port ${port}`); }) 安装nodemonNodemon支持在修改代码后无需重启即可生效,适用于开发环境。 > npm install nodemon -g在VS打开的终端中执行cnpm和nodemon命令报错: nodemon : 无法加载文件 D:\node.js\node_global\nodemon.ps1,因为在此系统上禁止运行脚本。在PowerShell中执行以下命令来修改执行权限: > Set-ExecutionPolicy -Scope CurrentUser 位于命令管道位置 1 的 cmdlet Set-ExecutionPolicy 请为以下参数提供值: ExecutionPolicy: RemoteSigned即可正常执行: > nodemon -v 2.0.16 启动Web服务器第一种启动方式 > node server.js这种方式启动时,每次改变代码后都需要重启,不适用于开发测试场景。执行Ctrl+C停止运行, 第二种启动方式 > nodemon server.js这种方式启动时,每次改变代码后都不需要重启,适用于开发场景。 修改package.json中的scripts部分: "scripts": { "start": "node server.js", "server": "nodemon server.js" }之后在终端执行 > npm run start相当于执行 node server.js。 执行 > npm run server相当于执行 nodemon server.js。 在浏览器打开http://localhost:5000/,可以见到 Hello World! |
CopyRight 2018-2019 实验室设备网 版权所有 |